<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<link rel="stylesheet" type="text/css" href="./Public/Home/css/order.css"/>
		<script type="text/javascript" src="./Public/jquery-1.12.2.min.js"></script>
		<script type="text/javascript" src="./Public/Home/js/area.js"></script>
		<link rel="stylesheet" href="./App/Home/View/Common/css/bottom.css" />
		<link rel="stylesheet" href="./App/Home/View/Common/css/head2.css" />
		<script type="text/javascript">
			$(function(){
				//初始化方法
				area.init('area');
				//修改的时候默认被选中效果
				area.selected('请选择省','请选择市','请选择区');
				$('.add-address').click(function(){
					$('.address-manage').show()
					$('.save-btn').show()
					$('.address-manage')[0].reset()
				})
				var num1 = 0;
				//点击收货地址旁边的文字
				$('.expand').eq(0).click(function(){
					//如果num1=0
					if(num1 == 0){
						//使用新地址隐藏
						$('.use-new-address').hide()
						//地址列表隐藏
						$('.exist-address-list').hide()
						//新地址表单隐藏
						$('.address-manage').hide()
						//保存地址按钮隐藏
						$('.save-btn').hide()
						//收货地址旁边的文字变为'修改'
						$(this).text('[修改]')
						//num变为1
						num1 = 1
					}else{
						//使用新地址显示
						$('.use-new-address').show()
						//地址列表显示
						$('.exist-address-list').show()
						$('.exist-address-list div').show()
						//保存地址按钮显示
						$('.save-btn').show()
						//地址表单显示
						$('.address-manage').show()
						//收货地址旁边的文字变为'不保存并关闭'
						$(this).text('[不保存并关闭]')
						num1 = 0
					}
					
				})
				var num = 0;
				//支付及送货时间
				$('.expand').eq(1).click(function(){
					//num为0
					if(num == 0){
						$(this).text('[不保存并关闭]')
						$('.modity-pay-info').hide()
						$('.pay-time-modify').show()
						num = 1
						$('.pay-btn').click(function(){
							var paytype = $('input[name=pay-type]:checked').siblings('label').html()
							var paytime = $('input[name=pay-time-radio]:checked').siblings('label').html()
							var callmevalue = $('input[name=call-me]:checked').attr('value')
							if(callmevalue == 'Y'){
								var callme = '是'
							}else{
								var callme = '否'
							}
							$('.modity-pay-info').show()
							$('.pay-time-modify').hide()
							$('#paytype').text(paytype)
							$('#paytime').text(paytime)
							$('#callme').text(callme)
							$('.expand').eq(1).text('[修改]')
						})
					}else{
						$(this).text('[修改]')
						$('.modity-pay-info').show()
						$('.pay-time-modify').hide()
						num = 0
					}
				})
				
				//点击保存地址按钮
				$('.save-btn').click(function(){
					//取得radio的value值 
					var value = $('input[name=address]:checked').attr('value')
					//如果是零 证明是点击了使用新地址 这时候才发送ajax 把from表单的内容发到后台   添加到数据库
					if(value == '0'){
						var d = $('.address-manage').serialize()
						$.ajax({
							type:"post",
							url:"{{U('addAddress')}}",
							data:d,
							dataType:"json",
							success:function(phpData){
								var str = "<div class='shippingaddress'><input  class='radio' type='radio'  name='address' checked='checked' value='"+phpData.said+"'/>&nbsp;<label for=''><strong>"+phpData.name+"&nbsp;</strong>"+phpData.province+"&nbsp;"+phpData.city+"&nbsp;"+phpData.county+"&nbsp;"+phpData.code+"&nbsp;"+phpData.phone+"<a href='javascript:void(0)' class='default-address'>设为默认地址</a><div class='order-modify-btn'><span class='address-modify'>[修改]</span><span class='address-del'>[删除]</span></div></label></div>"
								$('.exist-address-list').prepend(str)
							}
						});
						//把收货地址旁的文字改为修改
						$('.expand').eq(0).text('[修改]')
						//填写地址表单隐藏
						$('.address-manage').hide()
						//保存地址按钮隐藏
						$('.save-btn').hide()
						//使用新地址隐藏
						$('.use-new-address').hide()
						//地址列表的子集隐藏
						$('.shippingaddress').hide()
						//选中的地址显示
						$('input[name=address]:checked').parent('.shippingaddress').show()
						num1 =1
					//如果没有选使用新地址  选了其他地址的话
					}else{
						//地址表单隐藏
						$('.address-manage').hide()
						//使用新地址隐藏
						$('.use-new-address').hide()
						//地址列表子集隐藏
						$('.shippingaddress').hide()
						//收货地址旁的文字变为'修改'
						$('.expand').eq(0).text('[修改]')
						//保存按钮隐藏
						$('.save-btn').hide()
						//选中的地址显示
						$('input[name=address]:checked').parent('.shippingaddress').show()
						//选中的地址的“设为默认地址隐藏”
						$('input[name=address]:checked').siblings('label').children('.default-address').hide()
						//选中的地址的“修改 删除按钮隐藏”
						$('input[name=address]:checked').siblings('label').children('.order-modify-btn').hide()
						num1 =1
					}
				})
				
				$('.submit').click(function(){
					$('.address-expand').submit();
				})
				
				//点击删除地址按钮
				$('.exist-address-list').delegate('.address-del','click',function(){
					var value = $(this).parents('label').siblings('input').attr('value')
					$.ajax({
						type:"post",
						url:"{{U('delAddress')}}",
						data:{said:value},
					});
					$(this).parents('.shippingaddress').remove()
				})
				
			})
		</script>
	</head>
	<body>
		
		{{include file="../Common/View/head2"}}
		
		<div class="order-ensure-page">
			<div id="order-edit">
				<div class="order-title">
					<div class="carimg"></div>
					<div class="rightitle">
						<p class="first">查看购物车</p>
						<p class="active">填写订单</p>
						<p class="end">付款购买</p>
					</div>
				</div>
				
				<div class="order-edit-main">
					<div class="title">
						请填写并核对以下信息
						<a class="btn_backcart" href="{{U('Cart/index')}}"></a>
					</div>
					<div class="order-content">
						<div class="order-selection address-list">
							<h2>
								收货地址：
								<span class="expand">[不保存并关闭]</span>
							</h2>
							<div class="address-list-inner">
								<!--<div class="exist-address-list address-expand">-->
								<form action="{{U('Pay/index')}}" method="post" class="exist-address-list address-expand">
									{{foreach from="$saData" key="$k" value="$v"}}
									<div class="shippingaddress">
										<input class="radio" type="radio"  value="{{$v['said']}}" name="address"/>
										<label for="">
											<strong>{{$v['name']}}</strong>
											{{$v['province']}} {{$v['city']}} {{$v['county']}}{{$v['address']}} {{$v['code']}} {{$v['phone']}} 
											<a href="javascript:void(0)" class="default-address">设为默认地址</a>
											<div class="order-modify-btn">
												<span class="address-modify">[修改]</span>
												<span class="address-del">[删除]</span>
											</div>
										</label>
									</div>
									{{endforeach}}
									<div class="use-new-address">
										<input  class="radio add-address" type="radio" name="address"  value="0" />
										<span>使用新地址</span>
									</div>
								</form>
								<!--</div>-->
								<form class="address-manage" action="javascript:void(0);" method="post" style="display: none;">
									<ul>
										<li>
											<span class="address-legend"><i>*</i>收货人姓名：</span>
											<input type="text" name="name" id="name" value="" />
											<span>请填写您的真实姓名，最多5个汉字</span>
										</li>
										<li>
											<span class="address-legend"><i>*</i>省市：</span>
											<select name="province" id="area1" class="text-input">
											</select>
											<select name="city" id="area2" class="text-input">
											</select>
											<select name="county" id="area3" class="text-input">
											</select>
											<input type="text" name="address" id="detail" value="" />
											<span>标'*'的为支持加急送的地区，请输入收货的详细地址</span>
										</li>
										<li>
											<span class="address-legend"><i>*</i>手机号码：</span>
											<input type="text" name="phone" id="detail" value="" />
											<span>填写正确手机号便于接收发货和收货通知</span>
										</li>
										<li>
											<span class="address-legend">固定电话：</span>
											<input type="text" name="telcode" class="tel-lengend text-input" value="" />--
											<input type="text" name="tel" class="text-input" value="" />
											<span>如：010-12345678，固话和手机号至少填一项</span>
										</li>
										<li>
											<span class="address-legend">电子邮件：</span>
											<input type="text" name="email" id="detail" value="" />
											<span>用来接收订单提醒邮件，便于您及时了解订单状态</span>
										</li>
										<li>
											<span class="address-legend">邮编：</span>
											<input type="text" name="code" id="detail" value="" />
											<span>请填写准确的邮编，以确保商品尽快送达</span>
										</li>
									</ul>
								</form>
								<div class="save-btn new-user-btn" >保存并送到这个地址</div>
								
							</div>
						</div>
						<div class="order-selection pay-time">
							<h2>支付及送货时间：
								<span class="expand">[修改]</span>
							</h2>
							<div class="modity-pay-info" >
								<p>付款方式：
									<span id="paytype">在线支付</span>
								</p>
								<p>送货时间：
									<span id="paytime">只工作日送货（双休日、节假日不送）</span>
								</p>
								<p>送货前联系我：
									<span id="callme">否</span>
								</p>
							</div>
							
							<div class="pay-time-modify" >
								<h3 class="pay-time-title">支付方式</h3>
								<ul>
									<li class="pay-dashed-hr pay-recommend">
										<div class="pay-type-legend">
											<input type="radio" name="pay-type" id="" value="" checked="checked"/>
											<label for="">在线支付（推荐）</label>
										</div>
										<span class="pay-type-legend2">查看支持在线支付的银行和平台</span>
										<div class="support-type">
											
										</div>
									</li>
									<li>
										<input type="radio" name="pay-type" id="" value="" />
										<label for="">货到付款</label>
										<span class="pay-type-tips">注：订单中有限量商品、预售商品、化妆品或者订单金额超过5000元不可以选择货到付款。</span>
									</li>
								</ul>
								<h3 >送货时间</h3>
								<ul>
									<li>
										<input type="radio" name="pay-time-radio" id="1" value="" />
										<label for="">只工作日送货</label>
									</li>
									<li>
										<input type="radio" name="pay-time-radio" id="2" value="" checked="checked"/>
										<label for="">工作日、双休日和节假日均送货</label>
									</li>
									<li>
										<input type="radio" name="pay-time-radio" id="3" value="" />
										<label for="">只双休日、节假日送货(工作日不送货)</label>
									</li>
									<li class="pay-dashed-hr pay-type-tips">声明：我们会努力按照您指定的时间配送，但因为天气、交通等各类因素影响，您的订单有可能会有延误现象，敬请谅解！</li>
									<li>
										<span>送货前联系：</span>
										<input type="radio" name="call-me" id="" value="Y" />
										<label for="">是</label>
										<input type="radio" name="call-me" id="" value="N" checked="checked"/>
										<label for="">否</label>
									</li>
								</ul>
								<span class="pay-btn">确定</span>
							</div>
							
							
						</div>
						<div class="order-selection select-express">
							<h2>选择快递：</h2>
							<div class="express-list">
								<input type="radio" name="carriagegroup" id="common-1" value="1" checked="checked"/>
								<label for="carriagegroup">普通快递：  运费 ￥0.00  </label>
							</div>
							<div class="express-list">
								<input type="radio" name="carriagegroup" id="common-2" value="2" />
								<label for="carriagegroup">顺丰速运：  运费 ￥5.00  (仅支持顺丰可配送的地区)</label>
							</div>
							<div class="express-list express-tips">
								注：配送会由于天气，交通等不可抗拒的客观因素造成您收货时间延迟，请您知悉。
							</div>
							<div class="express-list is-sup">
								<span class="sf">您所选择的区域暂不在顺风派送范围内,</span>
								<a href="">点击查看详情</a>
							</div>
						</div>
						
						
					</div>
				</div>
			</div>
			
			<div class="order-pay">
					<div class="pay-wapper">
						<table>
							<tr class="title">
								<th style="width:395.217px;">商品信息</th>
								<th style="width:13%;">单价（元）</th>
								<th style="width:7%;">返YOHO币</th>
								<th style="width:10%;">数量</th>
								<th style="width:10%;">小计（元）</th>
								<th style="width:20%;">商品金额（元）</th>
							</tr>
							{{foreach from="$data" key="$k" value="$v"}}
							<tr class="common-sell-box">
								<td>
									<a class="pay-pro-icon " href="">
										<img src="{{$v['listpic']}}" alt="" />
									</a>
									<p class="pay-pro-info">
										<a href="{{U('Content/index',array('gid'=>$v['id']))}}">{{$v['name']}}</a>
										<span>{{foreach from="$v['options']" key="$kk" value="$vv"}}{{$kk}}：{{$vv}}&nbsp;{{endforeach}}</span>
									</p>
								</td>
								<td>
									<p class="productPrice">￥{{$v['price']}}</p>
								</td>
								<td>0</td>
								<td>{{$v['num']}}</td>
								<td class="sub-total" style="font-weight: bold;">
									￥{{$v['total']}}
								</td>
								<td class="cart-sub-total-all">
									<strong>￥{{$v['total']}}</strong>
								</td>
							</tr>
							{{endforeach}}
						</table>
						
						<div class="play-content clearfix">
							<div class="play-left">
								<li class="play-piao-pan">索要发票</li>
								<li class="play-remark-pan">添加备注信息</li>
							</div>
							
							<div class="play-right">
								<div class="play-total">
									<p>
										商品总价：
										<span>+ ¥{{$totalPrice}}</span>
									</p>
									<p class="total-express-w">
										运费：
										<span>+ ¥0.00</span>
									</p>
								</div>
							</div>
						</div>
						
					</div>
					
					<div class="to-play">
						<p>
							您需要实际支付金额： 
							<span>{{$totalPrice}}</span>元
						</p>
						<div class="btn-group">
							<!--<a class="submit" href="{{U('Pay/index')}}">去付款</a>-->
							<input type="button" class="submit" id="" value="去付款" />
						</div>
					</div>
			</div>
		</div>
		
		{{include file="../Common/View/bottom"}}
		
	</body>
</html>
